import React, { Component } from 'react'
import { connect } from 'react-redux'
import { View, Button, Text } from '@tarojs/components'
import Taro from '@tarojs/taro'

import { add, minus, asyncAdd } from '../../actions/counter'

import Test from '../../components/test/test'

import './index.scss'

import set_title from '../../utils/set_title'

@connect(({ counter }) => ({
  counter
}), (dispatch) => ({
  add () {
    dispatch(add())
  },
  dec () {
    dispatch(minus())
  },
  asyncAdd () {
    dispatch(asyncAdd())
  }
}))
class Index extends Component {
  config = {

  }

  onPullDownRefresh() {
    console.log(0)
  }

  componentWillReceiveProps (nextProps) {
    console.log(this.props, nextProps)
  }

  componentWillUnmount () { }

  componentDidShow () { }

  componentDidHide () { }

  componentDidMount() {
    // set_title('title title')

    Taro.cloud.init()
    
    Taro.cloud.callFunction({
      // 要调用的云函数名称
      name: 'add',
      // 传递给云函数的event参数
      data: {
        x: 6,
        y: 4,
      }
    }).then(res => {
      console.log(res.result.sum)
      // output: res.result === 3
    }).catch(err => {
      // handle error
    })
  }

  handleNavigate() {
    Taro.navigateTo({
      url: '/weapp/weapp-page'
    })
  }

  render () {
    console.log(process.env.TARO_ENV)
    return (
      <View className='index'>
        <Test></Test>
        <Button className='add_btn' onClick={this.props.add}>+</Button>
        <Button className='dec_btn' onClick={this.props.dec}>-</Button>
        <Button className='dec_btn' onClick={this.props.asyncAdd}>async</Button>
        <Button className='dec_btn' onClick={this.handleNavigate.bind(this)}>goto-weapp-page</Button>
        <View><Text>{this.props.counter.num}</Text></View>
        <View><Text>Hello, World</Text></View>
        <View><Text>Hello, World</Text></View>
      </View>
    )
  }
}

export default Index

